<%@ page contentType="text/html;charset=UTF-8" %>
<%@ include file="/common/taglibs.jsp" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <%@ include file="/common/common-css.jsp" %>
    <style>
        #jquery-table td {
            cursor: pointer !important
        }

        .load_bg {
            background: #000;
            opacity: 0.1;
            left: 0px;
            top: 0px;
            position: fixed;
            height: 100%;
            width: 100%;
            overflow: hidden;
            z-index: 10000;
        }

        .load_img {
            left: 50%;
            top: 180px;
            position: fixed;
            height: 50px;
            overflow: hidden;
            z-index: 20000;
        }
    </style>
</head>
<body class="no-skin">
<div class="load_bg" style="display:none"></div>
<img src="http://img.xmiles.cn/commentloading.gif" class="load_img" style="display:none"/>
<div class="page-content">
    <form id="queryForm">
        <div class="page-content-area">
            <div class="row">
                <div class="col-sm-12">
                    <div class="widget-box"
                         style="border:0px solid #ccc; border-top:none;border-bottom:none;margin-top:15px;">
                        <hr style="margin-top:0px;margin-bottom:0x">
                        <div class="widget-header widget-header-blue widget-header-flat">
                            <h4 class="widget-title">微信关键字</h4>
                            <div class="widget-toolbar">
                                <a href="#" data-action="collapse">
                                    <i class="ace-icon fa fa-chevron-up"></i>
                                </a>
                            </div>
                        </div>
                        <hr>
                        <div class="widget-body">
                            
                            <div class="form-group col-xs-12 col-sm-4 col-md-3 col-lg-3">
                                <label class="col-sm-6 control-label" style="text-align:right" for="is_coupon">渠道用券类型:</label>
                                <div class="col-sm-6">
                                    <select id="is_coupon" name="is_coupon">
                                        <option value="" selected>全部</option>
                                        <option value="1">加油券</option>
                                    </select>
                                </div>
                            </div>

                            <div class="form-group col-xs-12 col-sm-4 col-md-3 col-lg-3">
                                <label class="col-sm-6 control-label" style="text-align:right" for="k-word">关键字:</label>
                                <div class="col-sm-6">
                                    <s:select id="k-word" name="keyword" list="%{keywordsList}" cssClass="form-control"
                                              headerKey="" headerValue="全选"/>
                                </div>
                            </div>
                               
                             <div class="form-group col-xs-12 col-sm-4 col-md-3 col-lg-3">
                                <label class="col-sm-6 control-label" style="text-align:right" for="channel">渠道名:</label>
                                <div class="col-sm-6">
                                    <s:select id="channel" name="channel" list="%{channelList}" cssClass="form-control"
                                              headerKey="" headerValue="全选"/>
                                </div>
                            </div>

                            <div class="widget-main">
                                <div class="form-group col-xs-12 col-sm-4 col-md-3 col-lg-3" style="text-align:right">
                                    <button class="btn btn-purple  no-border" type="button" name="btn-query"
                                            onclick="query_any()">
                                        <i class="ace-icon fa fa-search icon-on-right bigger-110"></i>
                                        查询
                                    </button>
                                    &nbsp;&nbsp;&nbsp;
                                    <button class="btn btn-grey  no-border" type="reset">
                                        <i class="ace-icon fa fa-undo icon-on-right bigger-110"></i>
                                        重置
                                    </button>
                                    &nbsp;&nbsp;&nbsp;
                                    <button type="button" name="btn-add" class="btn btn-green  no-border"
                                            onclick="doAdd();">
                                        <i class="ace-icon fa fa-undo icon-on-right bigger-110"></i>
                                        新增
                                    </button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <hr style="display:none;" id="delete_hr">
            <div class="row">
                <div class="col-xs-12">
                    <table id="jquery-table" class="table table-striped table-bordered table-hover">
                    </table>
                </div>
            </div>
        </div>
    </form>
</div>

<%@ include file="/common/common-js.jsp" %>
<script type="text/javascript" src="${ctx}/js/call_func.js"></script>
<script type="text/javascript">
    function query_any() {
        if (jqTable != null) {
            jqTable.fnDraw();
        }
        else {
            loaddata();
        }
    }
    
    var jqTable = null;
    var loaddata = function () {
        jQuery(function ($) {
            jqTable = $('#jquery-table').dataTable({
                "columnDefs": [
                    {
                        "title": "渠道",
                        "targets": [0],
                        "name": "channel",
                        "data": "channel",
                        "bSortable": false
                    },
                    {
                        "title": "关键字",
                        "targets": [1],
                        "name": "keyword",
                        "data": "keyword",
                        "bSortable": false
                    },
                    {
                        "title": "优惠券ID",
                        "name": "fuel_coupon_id",
                        "data": "fuel_coupon_id",
                        "targets": [2],
                        "bSortable": false
                    },
                    {
                        "title": "创建时间",
                        "targets": [3],
                        "name": "createtime",
                        "data": "createtime",
                        "bSortable": false
                    },
                    {
                        "title": "用券类型",
                        "targets": [4],
                        "name": "coupon_type",
                        "data": "coupon_type",
                        "bSortable": false,
                        "render": function (v) {
                            switch (v) {
                                case 1:
                                    return '加油券';
                                default:
                                    return v;
                            }
                        }
                    },
                    {
                    	"title": "编辑",
                        "targets": [5],
                        "name": "id",
                        "data": "id",
                        "bSortable": false,
                    	"render": function (value, type, row) {
                            var temp = "<input class='btn btn-blue btn-sm' type='button' value='编辑' onclick='editBanner(" + row.id + ")'/><BR/><BR/>";
                            return temp;
                        }
                    }
                ],
                "sAjaxSource": ctx + "/weixin/weixin_keyword_coupon_list.action?rd=" + Math.random(),
                "fnServerData": function (sSource, aoData, fnCallback) {
                    var data = $('#queryForm').serializeObject();
                    data.aoData = JSON.stringify(aoData);
                    $.ajax({
                        "dataType": 'json',
                        "type": "POST",
                        "url": sSource,
                        "data": data,
                        "success": function (resp) {
                            fnCallback(resp);
                            initListPage();
                            $(".load_bg").attr("style", "display:none");
                            $(".load_img").attr("style", "display:none");
                        },
                        "error": function (XMLHttpRequest, textStatus, errorThrown) {
                            $(".load_bg").attr("style", "display:none");
                            $(".load_img").attr("style", "display:none");
                            alert('请求服务器错误,请刷新重试！！');
                        }
                    });
                },
                "fnRowCallback": function (nRow, aData, iDisplayIndex, iDisplayIndexFull) {
                },
                "sScrollXInner": "100%",
                "sScrollY": "100%"
            });
        });
    };

    function doAdd() {
        openDialogWithRand('/weixin/keyword_coupon_edit.jsp?action', 1000, 800, "新增微信关键字回复/关注文案", function () {
            jqTable.fnDraw();
        });
    }

    function editBanner(id) {
        openDialogWithRand('/weixin/keyword_coupon_edit.jsp?action=edit&id=' + id, 1000, 800, "编辑微信关键字回复/关注文案", function () {
            jqTable.fnDraw();
        });
    }

    function updateBanner(id, status) {
        $.getJSON(ctx + '/weixin/weixin_keyword_update_status.action', {
            id: id,
            newStatus: status,
            action: 'update'
        }, function (result) {
            if (result.status == 0) {
                jqTable.fnDraw();
            }
            else {
                alert('修改失败');
            }
        }).error(function () {//失败处理
            $(".load_bg").attr("style", "display:none");
            $(".load_img").attr("style", "display:none");
            alert('请求服务器错误,请刷新重试！！');
        });
    }

    jQuery(function ($) {
        $("#k-word").combobox();
        $("#channel").combobox();
    });
</script>
</body>
</html>
